<template>
    <t-dialog
      header="查看构建信息"
      :visible.sync="showDialogView"
      @confirm="onConfirm"
      :confirmOnEnter="true"
      :onConfirm="onConfirmAnother"
      :onCancel="onCancel"
      :onEscKeydown="onKeydownEsc"
      :onCloseBtnClick="onClickCloseBtn"
      :onOverlayClick="onClickOverlay"
      :onClose="close"
      width='50%'
    >

    <!-- <t-space direction="vertical"> -->
    <t-collapse :default-value="[1]" :borderless="true" @change="handlePanelChange" :context="this.data.testcase_log">
      <t-collapse-panel destroy-on-collapse header="构建参数内容" style="white-space: pre-line;">
        {{this.data.build_info}}
      </t-collapse-panel>
      <t-collapse-panel header="执行日志" style="white-space: pre-wrap;">
        {{this.data.jenkins_log}}
      </t-collapse-panel>    
    </t-collapse>
    <!-- <div style="margin-top: 10px">当前展开项:{{ currentItem }}</div> -->
      <!-- </t-space>      -->
    </t-dialog>
  </template>
  
<script lang="jsx">

export default {
  name: 'ViewDialogComp',

  props: {
    showChildDialogView: {
      type: Boolean,
      default: false
    },
  },
  data() {
    return { 
      layout: 'vertical', // 纵向布局
      data:{},
    };
  },

  computed: {
    showDialogView: {
      get() {
        return this.showChildDialogView
      },
      set(newValue) {
        this.$emit('update:showChildDialogView', newValue) // 触发更新事件，父组件的showDialogAdd会自动更新
      }
    },
  },

  methods: {
    init(data) {
    // this.showDialog=true;
    // data是父组件弹窗传递过来的值，我们可以打印看看
    // this.formData = data;
      console.log('来自父组件的aa', data);
      this.data = data;
    
    },
    onConfirm() {
      console.log('oncofrirm')
      this.showDialogView = false;
    },
    
    onConfirmAnother(context) {
      console.log('点击了确认按钮11122', context);
      this.showDialogView = false;
    },
    close() {
      this.showDialogView = false;
      console.log('关闭弹窗，点击关闭按钮、按下ESC、点击蒙层等触发', this.showDialogView);
    },
    onCancel(context) {
      this.showDialogView = false;
      console.log('点击了取消按钮', context);
    },
    onKeydownEsc(context) {
      console.log('按下了ESC', context);
    },
    onClickCloseBtn(context) {
      console.log('点击了关闭按钮', context);
    },
    onClickOverlay(context) {
      console.log('点击了蒙层', context);
    },
    onReset(data) {
      console.log(data);
    },
    
    handleChange(...args) {
      console.log('change', ...args);
    },
    handlePanelChange(val) {
      this.currentItem = val;
    },
  },

};
</script>

  <style lang="less" scoped>
  @import '@/style/variables.less';
  
  /deep/ [class*='t-table-expandable-icon-cell'] .t-icon {
    background-color: transparent;
  }
  
  
  .t-button + .t-button {
    margin-left: var(--td-comp-margin-s);
  }
  .t-button {
    margin-right: 20px;
  }
  .tdesign-demo-form-status .t-input {
    width: 520px;
  }
  
  </style>